﻿function SetApartmentRoller(apartments) {
    var dom = {
        Name: $('#opinion-apartment-name'),
        Left: $('#ap-swi-l'),
        Right: $('#ap-swi-r'),
        Wrapper: $('.opinion-apartment-wrap'),
        Bar: $('.opinion-apartment-bar'),
        Image: $('.opinion-apartment-image')
    }

    dom.Name.data('defaultName', dom.Name.text());
    dom.Left.show();
    dom.Right.show();
    dom.Left.css('cursor', 'pointer').click(function () { ApartmentRollerSwitch('left', apartments); });
    dom.Right.css('cursor', 'pointer').click(function () { ApartmentRollerSwitch('right', apartments); });
    dom.Wrapper.data('default-image', dom.Image.css('background-image'));

    var apid = parseInt($('#apartmentType').val());
    // preloading and set right content
    for (var xa = 0; xa < apartments.length; xa++) {

        $('<img />').attr('src', apartments[xa].GetImageUrlBoxed(392, 294));
        if (apartments[xa].ApartmentId == apid) {
            dom.Name.text(apartments[xa].ShortName);
            dom.Image.css('background-image', 'url("' + apartments[xa].GetImageUrlBoxed(392, 294) + '")').data('apartment-id', apid);
        }
    }

    dom.Bar.click(function (e) {
        e.stopPropagation();
    });

    dom.Wrapper.css('cursor', 'pointer').click(function () {
        var crnA = $('.opinion-apartment-image').data('apartment-id');
        if (!crnA)
            crnA = 0;
        $('#apartmentType').val(crnA);
        $('form').submit();
    });

}

function ApartmentRollerSwitch(direction, apartments) {
    var $name = $('#opinion-apartment-name');
    var $wrap = $('.opinion-apartment-wrap');
    var $opt = $('.opinion-apartment-image');
    var $newEl = $opt.clone();
    var $newElLeft = $opt.width() + 'px';
    if (direction == 'right')
        $newElLeft = '-' + $newElLeft;

    $newEl.css('left', $newElLeft);
    $wrap.prepend($newEl);

    var nextApartment = apartments[0];
    if (direction == 'left')
        nextApartment = apartments[apartments.length - 1];

    var crnA = $opt.data('apartment-id');
    if (crnA) {
        for (var xa = 0; xa < apartments.length; xa++) {
            if (apartments[xa].ApartmentId == crnA) {
                if (direction == 'right') {
                    if (xa + 1 < apartments.length)
                        nextApartment = apartments[xa + 1];
                    else
                        nextApartment = undefined;
                } else {
                    if (xa > 0)
                        nextApartment = apartments[xa - 1];
                    else
                        nextApartment = undefined;
                }
                break;
            }
        }
    }

    var $imgUrl = '';
    var $title = '';

    if (nextApartment) {
        $imgUrl = 'url("' + nextApartment.GetImageUrlBoxed(392, 294) + '")';
        $title = nextApartment.ShortName;
        $newEl.data('apartment-id', nextApartment.ApartmentId);
    } else {
        $imgUrl = $wrap.data('default-image');
        $title = $name.data('defaultName');
    }

    var $optLeft = $opt.width() + 'px';
    if (direction == 'left')
        $optLeft = '-' + $optLeft;

    $('<img />').load(function () {
        $newEl.css('background-image', $imgUrl);
        $name.text($title);
        $opt.animate({ left: $optLeft }, function () { $opt.remove(); });
        $newEl.animate({ left: '0px' });
    }).attr('src', $imgUrl.substring(5, $imgUrl.length - 2));
}

$(function () {
    GetAllApartments(SetApartmentRoller);
});
